<template>
  <BaseLayout title="代码模板" @query="init" @reset="reset">
    <template #button>
      <el-button type="primary" @click="addTemplate">新增</el-button>
    </template>
    <template #query>
      <el-form
          :model="queryForm"
      >
        <el-form-item prop="templateName" label="模板名称">
          <el-input type="text" v-model="queryForm.templateName" placeholder="请输入模板名称"/>
        </el-form-item>
      </el-form>
    </template>
    <template #table>
      <el-table height="100%" v-loading="loading" :data="data">
        <el-table-column type="index" label="序号" width="60" align="center" header-align="center"/>
        <el-table-column prop="templateName" label="模板名称"/>
        <el-table-column prop="templateType" label="模板类型" align="center" header-align="center" width="180">
          <template #default="scope">
            <BaseTag :value="scope.row.templateType" :dict="templateTypeOptions"></BaseTag>
          </template>
        </el-table-column>
        <el-table-column prop="type" label="应用类型" align="center" header-align="center" width="180">
          <template #default="scope">
            <BaseTag :value="scope.row.type" :dict="applicationTypeOptions"></BaseTag>
          </template>
        </el-table-column>
        <el-table-column prop="codeType" label="模板语言" align="center" header-align="center" width="180">
          <template #default="scope">
            <BaseTag :value="scope.row.codeType" :dict="codeTypeOptions"></BaseTag>
          </template>
        </el-table-column>
        <el-table-column label="操作" width="180" align="center" header-align="center">
          <template #default="scope">
            <el-button link type="primary" @click="editTemplate(scope.$index, scope.row)">编辑</el-button>
            <el-button link type="danger" @click="removeTemplate(scope.$index, scope.row)">删除</el-button>
          </template>
        </el-table-column>
      </el-table>
      <AddOrUpdateTemplate @load="init" ref="addOrUpdateTemplateRef"></AddOrUpdateTemplate>
    </template>
    <template #page>
      <BasePage @load="init" v-model:current="queryForm.current" v-model:size="queryForm.size"
                :total="queryForm.total"></BasePage>
    </template>
  </BaseLayout>
</template>

<script setup lang="ts" name="codeTemplate">
import AddOrUpdateTemplate from './AddOrUpdateTemplate.vue'
import {reactive, ref} from "vue";
import {TemplateModel, TemplateQueryModel} from "/@/api/generator/model/TemplateModel";
import {deleteTemplateByTemplateId, listTemplatePage, selectTemplateByTemplateId} from "/@/api/generator/TemplateApi";
import {useDictStore} from "/@/store/modules/dict";
import {DictDataModel} from "/@/api/system/model/DictModel";
import {messageBox} from "/@/utils/BjxUtils";

const addOrUpdateTemplateRef = ref()
const codeTypeOptions = ref<DictDataModel[]>([])
const applicationTypeOptions = ref<DictDataModel[]>([])
const templateTypeOptions = ref<DictDataModel[]>([])
const queryForm = reactive<TemplateQueryModel>({
  templateName: '',
  size: 10,
  current: 1,
  total: 0
})
const loading = ref(false)
const data = ref<TemplateModel[]>([])
const init = async () => {
  loading.value = true
  await dictLoad()
  let res = await listTemplatePage(queryForm)
  data.value = res.records
  queryForm.size = res.size
  queryForm.current = res.current
  queryForm.total = res.total
  loading.value = false
}
const reset = () => {
  queryForm.templateName = ''
  queryForm.current = 1
  init()
}
/**
 * 新增模板
 */
const addTemplate = () => {
  addOrUpdateTemplateRef.value.init("新增模板")
}
/**
 * 删除模板
 */
const removeTemplate = (index: number,row: TemplateModel) => {
  messageBox("您确定要删除这个模板吗?",async ()=>{
    await deleteTemplateByTemplateId(row.templateId)
    init()
  })
}
/**
 * 修改模板
 */
const editTemplate = async (index: number,row: TemplateModel) => {
 let res = await  selectTemplateByTemplateId(row.templateId)
  addOrUpdateTemplateRef.value.init("修改模板",res)
}

const dictLoad = async () => {
  let dictStore = useDictStore();
  codeTypeOptions.value = await dictStore.getDict('code_type')
  applicationTypeOptions.value = await dictStore.getDict('application_type')
  templateTypeOptions.value = await dictStore.getDict('template_type')
}

</script>

<style scoped>

</style>